HTMLify

index.html
Views: 170 | Author: cody
<!DOCTYPE html>
<html lang="en" >
<head>
  <meta charset="UTF-8">
  <title>Call App</title>
  <link rel="stylesheet" href="./style.css">

</head>
<body>
<!-- partial:index.partial.html -->
<div class="phone-container is-locked">
  <div class="button mute"></div>
  <div class="button volume up"></div>
  <div class="button volume down"></div>
  <div class="button power"></div>
  <div class="phone-screen">
    <div class="clock"></div>
    <div class="status-bar">
      <i class="fas fa-signal"></i>
      <i class="fas fa-wifi"></i>
      <i class="fas fa-battery-half"></i>
    </div>
    <div class="phone-screen-notch">
      <div class="notch-speeker"></div>
      <div class="notch-camera"></div>
    </div>
    <div class="phone-footer"></div>
    <div class="phone-footer-button"></div>
    <div class="keyboard">
      <div class="key" data-keynumber="1">1</div>
      <div class="key" data-keynumber="2">2</div>
      <div class="key" data-keynumber="3">3</div>
      <div class="key" data-keynumber="4">4</div>
      <div class="key" data-keynumber="5">5</div>
      <div class="key" data-keynumber="6">6</div>
      <div class="key" data-keynumber="7">7</div>
      <div class="key" data-keynumber="8">8</div>
      <div class="key" data-keynumber="9">9</div>
      <div class="key asterisk" data-keynumber="*">*</div>
      <div class="key" data-keynumber="0">0</div>
      <div class="key cardinal" data-keynumber="#">#</div>
      <a class="callButton" href="" data-rel="external"><i class="fas fa-phone"></i></a>
    </div>
    <div class="dialer"></div>
    <div class="overlay mute">
      <div class="mute-content">
        <div class="title">Volume</div>
         <div class="icon"><i class="fas fa-microphone-slash"></i></div>
        <div class="subtitle">Silent</div>
      </div>
      <div class="sound-content">
        <div class="title">Volume</div>
        <div class="icon"><i class="fas fa-microphone"></i></div>
        <div class="sound-bar">
          <div class="bar"></div>
        </div>
      </div>
    </div>
    <div class="lock-screen">
      <div class="lock-time">
        <div class="lock-icon">
          <i class="fas fa-lock"></i>
        </div>
        <div class="time"></div>
        <div class="date"></div>
      </div>
      <div class="unlock-text"></div>
    </div>
  </div>
</div>
<!-- partial -->
  <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js'></script>
<script src='https://use.fontawesome.com/releases/v5.0.9/js/all.js'></script><script  src="./script.js"></script>

</body>
</html>

Comments